<template>
  <div class="content">
    <el-tabs v-model="activeName" class="top-tabs" @tab-click="handleClick">
    <el-tab-pane label="上传实时监测数据" name="first">
      <e-table ref="eTableRef" class="w100" pageName="chargeNowOrderTable1" :requestApi="chargeNowOrderTable1" :columns="columns1">
            <template #name="{ row }">
                <div class="row-name d-flex ai-center">
                  {{ row }}
                </div>
            </template>
        </e-table>
    </el-tab-pane>
    <el-tab-pane label="BMS需求和充电机输出" name="second">
      <e-table ref="eTableRef" class="w100" pageName="chargeNowOrderTable2" :requestApi="chargeNowOrderTable2" :columns="columns2">
            <template #name="{ row }">
                <div class="row-name d-flex ai-center">
                  {{ row }}
                </div>
            </template>
        </e-table>
    </el-tab-pane>
    <el-tab-pane label="充电过程BMS信息" name="third">
      <e-table ref="eTableRef" class="w100" pageName="chargeNowOrderTable3" :requestApi="chargeNowOrderTable3" :columns="columns3">
            <template #name="{ row }">
                <div class="row-name d-flex ai-center">
                  {{ row }}
                </div>
            </template>
        </e-table>
    </el-tab-pane>
  </el-tabs>

  </div>
</template>
<script setup>
import { chargeNowOrderTable1, chargeNowOrderTable2, chargeNowOrderTable3} from "@/api/modules/powerStation";


const activeName = ref('first');
const getData = (params) => {
  console.log(params);
};
const columns1 = [
    {
        label: "上传时间",
        prop: "addtime",
        width: 200,
    }, {
        label: "电压（V）",
        prop: "voltage",
        width: 200,
    }, {
        label: "电流（A）",
        prop: "electric_current",
        width: 200,
    }, {
        label: "SOC（%）",
        prop: "SOC",
        width: 200,
    }, {
        label: "电量（度）",
        prop: "electric_quantity",
        width: 200,
    }, {
        label: "计损电量（度）",
        prop: 'electric_quantity_past',
        width: 200,
    }, {
        label: "剩余时间",
        prop: 'remaining_time',
        width: 200,
    }, {
        label: "已充时间",
        prop: 'past_time',
        width: 200,
    }, {
        label: "充电状态",
        prop: 'charge_state',
        width: 200,
    }, {
        label: "枪线温度（℃）",
        prop: 'gunline_temperature',
        width: 200,
    }
];
const columns2 = [
    {
        label: "电池组最高温度（°C）",
        prop: "battery_highest",
    }, {
        label: "最高温度检测点编号",
        prop: "battery_highest_id",
    }, {
        label: "电池组最低温度（°C）",
        prop: "battery_lowest",
    }, {
        label: "最低温度检测点编号",
        prop: "battery_lowest_id",
    }
];
const columns3 = [
    {
        label: "最高单体电压",
        prop: "voltage_highest",
    }, {
        label: "最高单体电压检测点编号",
        prop: "voltage_highest_id",
    }, {
        label: "需求电压（V）",
        prop: "need_voltage",
    }, {
        label: "需求电流（A）",
        prop: "need_electricCurrent",
    }
];
defineExpose({
  getData,
});
</script>

<style lang="scss" scoped>
:deep(.el-tabs__nav-wrap::after){
  background-color: rgba(0,0,0,0);
}
:deep(.el-tabs__active-bar){
  background-color: rgba(0,0,0,0);
}
:deep(.el-tabs__item){
  color: #7E7E7E;
  font-size: 16px;
}
:deep(.el-tabs__item:hover){
  color: #F56D1C;
}
:deep(.el-tabs__item.is-active){
  color: #F56D1C;
}
</style>
